<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>订单结算</title>
    <link rel="stylesheet" href="/index/css/common.css?v=2">
    <link rel="stylesheet" href="/index/css/order.css?v=14">
</head>

<body>
<div class="tabsBox">
    <div class="topTab">
        <div class="tabLeft">
            <img src="/index/assets/left_J.png">
        </div>
        <div class="tabCenters">订单结算</div>
        <!-- <div class="tabRight">收益说明</div> -->
    </div>
</div>
<div class="payOrder">
    <div class="payInfor">
        <div class="payName">会员名称： {$user.nickname}</div>
        <div class="payNo">订单编号：{$order_sn}</div>
    </div>
    <div class="classBox">
        <div class="classLeft pur">
            <div class="classIntro">
                <img src="{$img_path}{$lesson.image}" alt="">
                <!--<div class="className">抖音100W粉丝</div>-->
                <!--<div class="fudao">外教一对一辅导</div>-->
            </div>
        </div>
        <div class="classRight">
            <div class="r_title">{$lesson.lesson_name}</div>
            <div class="r_stydy cleardrift">
                <div class="price" price="{$lesson.price}" lesson_id="{$lesson.id}">
                    <span>￥{$lesson.price}</span>
                </div>
            </div>
        </div>
    </div>
    {if !empty($vip)}
    <div class="huiyuan">

        <div class="VipImg">
            <!--<img src="/index/assets/bac.png" >-->
            <img src="{$img_path}{$vip.icon}">
        </div>
        <div class="huiyuanPrice">
            <div class="p_left">
                <div class="chengwei">成为{$vip.level_name}，全站课程免费看</div>
                <div class="profit">还可享受邀请用户最高{$vip.commission1}%收益</div>
            </div>
            <div class="p_right">
                <div class="p_money" price="{$vip.price}" level_id="{$vip.id}">¥{$vip.price}</div>
                <img src="/index/assets/sel_un.png" class="sel">
                <img src="/index/assets/sel.png" class="sels">
            </div>
        </div>
    </div>
    {/if}
</div>
<div class="pay-main">
    <div class="pay-type">
        <p style="color:#ff9003">实付金额：¥ <span class="show-money">{$lesson.price}</span></p>
        <p onclick="otherPay(this)" ><img src="/index/assets/icon/alipay.png?v=2" alt="">

            <span>支付宝支付</span>
            <span class="pay-sel sel-on" pay_type="2">✔</span>
        </p>
        <p  ><img src="/index/assets/icon/wxpay.png" alt="">

            <span>微信支付　</span>
            <span class="pay-sel " pay_type="1"></span>

        </p>

        <div class="pay-btn"><button>立即支付</button></div>
    </div>
</div>

<div class="payBtm">

    <div class="payMoney">￥<span class="show-money">{$lesson.price}</span></div>
    <div class="lijiPay">立即支付</div>
</div>
{include file='common/toast'}

</body>
<script type="text/javascript" src="/index/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/index/js/common.js?v=2"></script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<!--<script src="//cdn.jsdelivr.net/npm/eruda"></script>-->

<script>
    // eruda.init();

    // $(function () {
        $('.pay-main').click(function () {

            // $(".pay-type").slideUp(100);
            $(".pay-main").hide();
        });

        $('.pay-type').click(function(event){
            event.stopPropagation();

        })

        var type = 2;
        var id = $(".price").attr('lesson_id');

        var flag = true;


        $('.lijiPay').click(function (event) {

            if (isWeiXin()) {
                //微信内支付
                pay(0);
            } else {
                //其他浏览器
                // $(".pay-type").slideDown(100);
                $(".pay-main").show();

                event.stopPropagation();
            }
        })

        //选择支付方式
        function otherPay(event) {
            // pay(type);
            // event.stopPropagation();
            $('.pay-sel').removeClass('sel-on').text('')
            var obj = $(event).find('.pay-sel');
            if(obj.hasClass('sel-on')){
                obj.removeClass('sel-on').text('');
            }else{
                obj.addClass('sel-on').text('✔').siblings()
            }
        }

        //立即支付
      $('.pay-btn button').click(function(){
          var pay_type = $('.sel-on').attr('pay_type');

          console.log(pay_type);
          if(pay_type){
              pay(pay_type);
          }else{
              toastFail('请选择支付类型');
          }
      })

        //支付下单
        function pay(pay_type) {

            if (flag == false) {
                return;
            }

            flag = false;


            var data = {pay_type: pay_type};
            var action = '{:url("pay/payLesson")}';

            if (type == 2) {
                data.lesson_id = id;
            } else {
                data.level = id;
                action = '{:url("pay/payLevel")}';

            }

            if (pay_type == 2) {

                location.href = action + '?pay_type=2&lesson_id=' + id + '&level=' + id;

            }

            toast.loading({
                title: "支付中",
//                duration:2000
            })


            $.post(action, data, function (res) {


                flag = true;
                toast.hide();


                if (res.code == 1) {
                    if (pay_type == 1) {


                        location.href = res.pay_url
                    }
                    console.log(res.data);
                    WeixinJSBridge.invoke(
                        'getBrandWCPayRequest',
//						{
//                            "appId":res.data.appid, //公众号名称，由商户传入
//                            "timeStamp":''+res.data.time, //时间戳，自1970年以来的秒数
//                            "nonceStr":res.data.nonce_str, //随机串
//                            "package":"prepay_id="+res.data.prepay_id,   //订单详情扩展字符串
//                            "signType":"MD5", //微信签名方式：
//                            "paySign":res.data.sign //微信签名
//                        },
                        res.data,

                        function (msg) {
                            if (msg.err_msg == "get_brand_wcpay_request:ok") {
                                // 表示已经支付,res.err_msg将在用户支付成功后返回 ok。

                                if (res.section_id > 0) {
                                    toastSuccess('支付成功', '{:url("section/play")}?section_id=' + res.section_id);

                                } else {
                                    if (res.phone == '') {
                                        toastSuccess('支付成功', '{:url("mine/bindPhone",["id"=>$lesson["id"]])}?reg=1');

                                    } else {
                                        toastSuccess('支付成功', '{:url("lesson/details",["id"=>$lesson["id"]])}');
                                    }
                                }


//                                window.location.href = ;
                            } else {

                                toastFail('支付失败');
                            }
                        })
                } else {
                    toastFail(res.msg);
                }
            }, 'json')

        }


        $('.sel').click(function () {
            $('.sels').show()
            $('.sel').hide()
            $('.show-money').text($('.p_money').attr('price'))

            type = 1;
            id = $('.p_money').attr('level_id');
        })

        $('.sels').click(function () {
            $('.sel').show()
            $('.sels').hide()
            $('.show-money').text($('.price').attr('price'))

            type = 2;
            id = $('.price').attr('lesson_id');

        })

        if (!isWeiXin()) {

            var lesson_id =  $('.price').attr('lesson_id');
            setInterval(function () {
                $.get('{:url("pay/queryOrder")}', {type: 2, other_id:lesson_id }, function (res2) {
                    if (res2.code == 1) {
                        location.href = '{:url("section/play")}?section_id=' + res2.section_id
                    }
                }, 'json')
            }, 1000)
        }
    // })
</script>
</html>